import React, { Component } from 'react';
import "../styles/Index/Mine.scss"

class Mine extends Component {
    render() {
        return (
            <div className='mine'>
                <div className="user">
                    <div className="userdata">
                        <div className="left">
                            <div className="pic">🐱</div>
                            <div className="namebox">
                                <div className="name">Tom</div>
                                <div className="follow">关注 108万</div>
                            </div>
                        </div>
                        <div className="right">
                            <span>个人主页</span>
                        </div>
                    </div>
                    <div className="userutil">
                        <div className="collect item"><span>★</span><span>收藏</span></div>
                        <div className="footmark item"><span>👣</span><span>足迹</span></div>
                        <div className="wallet item"><span>💰</span><span>钱包</span></div>
                    </div>
                    <div className="vip">
                        <div className="left">
                            <span className="s1">VIP卡</span>
                            <span className="s2">开通即领百元红包</span>
                        </div>
                        <div className="right">
                            <span>立即开通</span>
                        </div>
                    </div>
                </div>
                <div className="myorder">
                    <div className="title">
                        <div className="left">我的订单</div>
                        <div className="right">查看全部＞</div>
                    </div>
                    <div className="infro">
                        <div className="item">
                            <div className='icon'>🧾</div>
                            <div>待付款</div>
                        </div>
                        <div className="item">
                            <div className='icon'>🧾</div>
                            <div>待发货</div>
                        </div>
                        <div className="item">
                            <div className='icon'>🧾</div>
                            <div>待收货</div>
                        </div>
                        <div className="item">
                            <div className='icon'>🧾</div>
                            <div>评价</div>
                        </div>
                        <div className="item">
                            <div className='icon'>🧾</div>
                            <div>退货退款</div>
                        </div>
                    </div>
                </div>
                <div className="mytools">
                    <div className="title"><div className="left">常用工具</div></div>
                    <div className="tools infro">
                        <div className="item">
                            <div className="icon">📋</div>
                            <div>签到领积分</div>
                        </div>
                        <div className="item">
                            <div className="icon">⛑</div>
                            <div className='iname'>客服</div>
                        </div>
                        <div className="item">
                            <div className="icon">⛳</div>
                            <div className='iname'>地址管理</div>
                        </div>
                        <div className="item">
                            <div className="icon">📞</div>
                            <div className='iname'>分享有礼</div>
                        </div>
                        <div className="item">
                            <div className="icon">📇</div>
                            <div className='iname'>发票服务</div>
                        </div>
                        <div className="item">
                            <div className="icon">📑</div>
                            <div className='iname'>意见反馈</div>
                        </div>
                        <div className="item">
                            <div className="icon">🛠</div>
                            <div className='iname'>设置</div>
                        </div>
                    </div>
                </div>
            </div>
        );
    }
}

export default Mine;